<template>
  <EDesigner ref="designerRef" @save="handleSubmit" title="EDesigner表单设计器">
    <template #header-prefix>
      <div>设计器的基础使用</div>
    </template>
  </EDesigner>
</template>
<script lang="ts" setup>
import { EDesigner, type PageSchema } from "@epic-designer/core";
import { ref, onMounted } from "vue";

const designerRef = ref<InstanceType<typeof EDesigner>>();
/**
 * 点击保存按钮操作
 * @param e
 */
function handleSubmit(e: PageSchema) {
  // console.log(designerRef.value.setDataSource);
}
onMounted(() => {
  ceshi();
});
/**
 * 测试获取数据的函数
 **/
const ceshi = () => {
  // let data = designerRef.value.getDataSource();
  // let data = designerRef.value.getData()
  let obj = [
    {
      id: "root",
      info: "页面",
      isKey: true,
      isNull: true,
      length: 101,
      name: "root",
      type: "int",
    },
    {
      id: "radio_shndnr9b",
      info: "性别1",
      isKey: true,
      isNull: true,
      length: 10,
      name: "radioSex",
      type: "int",
    },
  ];
  let str = JSON.stringify(obj);
  let data = designerRef.value.setDataSource(str);
  console.log(data, "测试获取数据--------------");
};
</script>
